import { router, resetRouter } from './index'
import { menuStore } from '@/store/routesMenu'
import { initRoutes } from './initRoute' // 初始化路由，提示路由
import { getToken } from '@/vueLsp/token' // 获取登录缓存得token
import { ElNotification } from 'element-plus'
import generator from './routes' // 自动读取pages下所有路由
import { filterAsyncRoutes } from './asyncRouter.js' // 筛选路

import NProgress from 'nprogress' // 导入 nprogress模块
import 'nprogress/nprogress.css' // 导入样式，否则看不到效果
NProgress.configure({ showSpinner: false }) // 显示右上角螺旋加载提示
NProgress.configure({
    easing: 'ease', // 动画的缓动函数（easing function）。这里设为 ease，表默认的缓动函数。
    speed: 500, // 递增进度条的速度;单位是毫秒
    showSpinner: false, // 是否显示加载ico;是否在显示加载图标
    trickleSpeed: 200, // 自动递增间隔;这里表示每间隔 200 毫秒自动递增一次进度
    minimum: 0.3 // 初始化时的最小百分比
})

// 获取白名单路径
const whiteList = []
initRoutes.forEach((item) => {
    whiteList.push(item.path)
})

// 当路由进入前
router.beforeEach((to, from, next) => {
    // 每次切换页面时，调用进度条
    NProgress.start() // 开启进度条
    document.title = to.meta.title || ''
    const menuState = menuStore()
    menuState.$state.currentActiveMenuPath = to.path
    document.title = to.meta.title || ''
    // 获取用户token，用来判断当前用户是否登录
    const hasToken = getToken()
    if (hasToken) {
        if (whiteList.includes(to.path)) {
            next()
            NProgress.done()
        } else {
            const stateRoutes = menuState.$state.addRoutes
            // 非响应式的，刷新浏览器重新获取权限数据
            /**
             * 页面刷新和登录进入时不应该有，如果有数据，但没有添加路由，还是找不到路径
             * 此处作为页面正常登录进入，添加了路由之后，后续页面点击是否权限匹配判断
             * 如果没有权限（没有匹配），哪怕有对应的页面路径都会跳到404页面。
             * 如果有数据说明添加过路由，有权限正常跳转
             */
            if (stateRoutes.length > 0) {
                if (to.matched.length === 0) {
                    // 如果未匹配到路由
                    document.title = '404'
                    next('/404')
                } else {
                    next()
                }
                NProgress.done()
            } else {
                // 异步获取store中的路由信息
                try {
                    // 获取角色路由结果
                    menuState
                        .getCurrentRoleAuthMenuFun()
                        .then((res) => {
                            const menuList = res.data.menuList || []
                            // console.log('菜单列表', menuList)
                            menuState.initAuthMenuFun(menuList)
                            const accessRoutes = filterAsyncRoutes(menuList, generator)
                            // console.log('路由权限列表', accessRoutes)
                            // 重置初始化路由后，重新添加路由生成总的路由表
                            resetRouter()
                            for (const x of accessRoutes) {
                                // 向name为'layout'的路由中添加子路由
                                router.addRoute('layout', x)
                            }
                            /**
                             * 参数to不能找到对应的路由的话，就再执行一次beforeEach((to, from, next)
                             * 直到其中的next({ ...to})能找到对应的路由为止。
                             * */
                            next({ ...to, replace: true })
                        })
                        .catch((err) => {
                            console.log(err)
                            ElNotification({
                                title: 'Error',
                                message: `错误信息：${err}`,
                                type: 'error'
                            })
                            // 中断当前导航，执行新的导航
                            next(`/login`)
                            NProgress.done()
                        })
                } catch (err) {
                    console.log(err)
                    ElNotification({
                        title: 'Error',
                        message: `错误信息：${err}`,
                        type: 'error'
                    })
                    // 中断当前导航，执行新的导航
                    next(`/login`)
                    NProgress.done()
                }
            }
        }
    } else {
        // 没有token 判断是否在白名单内
        if (whiteList.indexOf(to.path) !== -1) {
            next()
            NProgress.done()
        } else {
            next(`/login`)
            NProgress.done()
        }
    }
})

// 当路由进入后：关闭进度条
router.afterEach(() => {
    // 在即将进入新的页面组件前，关闭掉进度条
    NProgress.done() // 完成进度条
})
